<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>宽仁妇孺，祝您节日快乐</title>
<META http-equiv=imagetoolbar content=no>
<STYLE type=text/css>
html, body{margin:0;padding:0}

#DHTMLBOOK {
	BACKGROUND: #000; VISIBILITY: hidden; WIDTH: 100%; POSITION: absolute;  HEIGHT: 100% 
}
#TXTBOX {
	FONT-SIZE: 0.8em; WIDTH: 100%; COLOR: #aba193; FONT-FAMILY: verdana; POSITION: absolute; TOP: 100%; TEXT-ALIGN: center
}
.page {
	OVERFLOW: hidden; BORDER-LEFT: #000000 0px solid; WIDTH: 50%; CURSOR: pointer; POSITION: absolute; HEIGHT: 100%
}
.right {
	BORDER-RIGHT: #000000 0px solid; LEFT: 50%
}
.turn {
	BACKGROUND:#CCCCCC
}
.img {
	WIDTH: 200%; POSITION: absolute; HEIGHT: 100%
}
</STYLE>
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript" src="${pageContext.request.contextPath}/js/page/weixin/jweixin-1.0.0.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/page/weixin/popularize/popularize.js"></script>
<script type="text/javascript" src="http://pv.sohu.com/cityjson?ie=utf-8"></script>  
<SCRIPT type=text/javascript>
<!--

//记录推广访问记录
$(function(){
	krwx.popularize.addpopularize("2015三八妇女节问候");
});

document.onselectstart = function () { return false; }

var nI  = 0;
var kI  = 0;
var run = false;

function setOpacity(obj,o) {
	if (o<0) o=0; else if (o>100) o = 100;
	if (obj.filters)obj.filters.alpha.opacity=o; else obj.style.opacity = o/100;
}
function TPR__(p) {
	P1.style.left  = 50-(2.5*p)+"%";
	P1.style.width = (2.5*p)+"%";
	setOpacity(P1i, .5*p*p);
	if (p == 20) run = false;
}
function TPR_(p) {
	P2.style.width = 50-(2.5*p)+"%";
	setOpacity(P2i, 100-.5*(p*p));
	if (p == 20) {
		P2i.src = IMGSRC[kI].src;
		setOpacity(P2i, 100);
		P2.style.width = "50%";
		for(var i=1; i<=20; i++) {
		      
				if(kI==5&&i==20){
				  $("div[name='ziti1']").remove();
				setTimeout(function(){
        $("div[name='ziti']").css("display","block");
    
		 $("div[name='ziti']").find("div").hide();
        $("div[name='ziti']").find("div").eq(0).slideDown(2000);
		},500);
		}
		if(p==20&&kI==4){
		setTimeout(function(){
		$("div[name='ziti1']").css("display","block");
        $("div[name='ziti1']").find("div").hide();
         $("div[name='ziti1']").find("div").eq(0).slideDown(1800);
		 },200);
		}
		setTimeout("TPR__("+i+")", i*32)};
	}
}

function TPR() {


	if (!run) {
		run = true;
		P01i.src = IMGSRC[kI].src;
		P1.style.width = 0;
		
	if(kI<nI){
		kI++;
		P02i.src = IMGSRC[kI].src;
		P1i.src  = IMGSRC[kI].src;
		for (var i=1; i<=20; i++) setTimeout("TPR_("+i+")", i*32);
		setTimeout("TPR()", 3000);
			  }
		
	} else $("div[name='pic']").find("div").eq(5).show();
}

onload = function() {
	
IMGSRC  = document.getElementById("imgsrc").getElementsByTagName("img");

	DB      = document.getElementById("DHTMLBOOK");
P01     = DB.getElementsByTagName("span")[0];
	P01i    = P01.getElementsByTagName("img")[0];
	P02     = DB.getElementsByTagName("span")[1];
	P02i    = P02.getElementsByTagName("img")[0]; 
	P1      = DB.getElementsByTagName("span")[2];
	P1i     = P1.getElementsByTagName("img")[0];
	P2      = DB.getElementsByTagName("span")[3];
	P2i     = P2.getElementsByTagName("img")[0];
	nI      = IMGSRC.length;
	P1i.src = IMGSRC[0].src;
	P2i.src = IMGSRC[0].src;
	DB.style.visibility = "visible";
	$("div[name='gif']").remove();
	$("div[name='beijing']").remove();
	
	//判断浏览器是否支持音频，如果不支持就不放音乐了
	var hasVideo = !!(document.createElement('video').canPlayType);

	if(hasVideo)
	{
		
		//Media = document.getElementById("audio");
		var Media=$("#audio");
		Media.trigger("play");
		/*
		Media.play(function(){
			setTimeout("TPR()", 1000);
		});
		*/
		setTimeout("TPR()", 1000);
		//var autoplay=$(Media).attr("autoplay");
		//Media.play();
		//alert(autoplay);
		/*
		 Media.addEventListener("play",function(){
			 setTimeout("TPR()", 1000);
		 });
		*/
	}
	else
	{
		setTimeout("TPR()", 1000);
	}
	
}


//微信js-sdk代码-start
wx.config({
    debug: false, 
    appId: '${appId}', 
    timestamp: '${timestamp}', 
    nonceStr: '${nonceStr}', 
    signature: '${signature}',
    jsApiList: ['onMenuShareAppMessage','onMenuShareTimeline','onMenuShareQQ','onMenuShareWeibo'] 
});

wx.ready(function(){
	
	var title="宽仁妇孺，祝您节日快乐";
	var desc="宽仁之美 一生关爱";
	var link="http://www.kuanrf.com/pac/weixin/gotopage?pagename=popularize_38_index";
	var imgUrl="http://www.kuanrf.com/pac/images/popularize/38/xiameng.jpg";
	
	//分享给朋友
	wx.onMenuShareAppMessage({
	    title: title, 
	    desc: desc, 
	    link: link,
	    imgUrl: imgUrl, 
	    type: 'link', 
	    dataUrl: '', 
	    success: function () { 
	        
	    },
	    cancel: function () { 
	        
	    }
	});
	
	//分享到朋友圈
	wx.onMenuShareTimeline({
	    title: desc, 
	    link: link, 
	    imgUrl: imgUrl, 
	    success: function () { 
	        
	    },
	    cancel: function () { 
	        
	    }
	});
	
	//分享到qq
	wx.onMenuShareQQ({
	    title: title, // 分享标题
	    desc: desc, // 分享描述
	    link: link, // 分享链接
	    imgUrl: imgUrl, // 分享图标
	    success: function () { 
	       
	    },
	    cancel: function () { 
	       
	    }
	});
	
	//分享到腾讯微博
	wx.onMenuShareWeibo({
	    title: title, 
	    desc: desc, 
	    link: link, 
	    imgUrl: imgUrl,
	    success: function () { 
	       
	    },
	    cancel: function () { 
	       
	    }
	});
	
});

wx.error(function(res){


});
//微信js-sdk代码-end

//-->
</SCRIPT>
<META content="MSHTML 6.00.6000.16809" name=GENERATOR></HEAD>
<BODY >
<div style="display:none;">
<audio id="audio" controls="controls"  hidden="true" preload="true">
  <source src="${pageContext.request.contextPath}/images/popularize/38/mp33.mp3" type="audio/mpeg" />
</audio>
</div>
<div name="beijing" style="float:none; position:absolute;overflow:hidden;width:100%;height:100%;" > 
<div><img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/38.jpg" alt="0" /></div> 
</div>
<div name="gif" style="float:left; position:relative;overflow:hidden;width:25%;height:20%;z-index:1; margin-top:40%; margin-left:48%" > 
<div><img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/712.gif" alt="0" style="opacity:0.2"/></div> 
</div>

<div  name="ziti1" style="float:right; position:relative;overflow:hidden;width:30%;height:60%;display:none; z-index:2; margin-right:50%; margin-top:10%; ">
<div><img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/wenzi1.png" alt="8"/></div> 

</div>
<div  name="ziti" style="float:right; position:relative;overflow:hidden;width:30%;height:70%;display:none; z-index:3;  margin-right:28%; margin-top:10%;">
<div><img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/wenzi.png" alt="7"/></div> 

</div>
<DIV id=center>
<DIV id=DHTMLBOOK >
<SPAN class=page ><IMG class=img ></SPAN>
<SPAN class="page right"><IMG class=img style="LEFT: -100%"></SPAN>
<SPAN class="page turn" ><IMG class=img style="FILTER: alpha(); opacity: 1"></SPAN>
<SPAN class="page turn right" ><IMG class=img style="FILTER: alpha(); LEFT: -100%; opacity: 1"></SPAN> 
</DIV></DIV>
<DIV id=imgsrc style="display:none; " name="pic">
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/1.jpg" alt="1"/>
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/2.jpg" alt="2"/>
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/3.jpg" alt="3"/>
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/4.jpg" alt="4"/>
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/5.jpg" alt="5"/>
<img width="100%" height="100%" src="${pageContext.request.contextPath}/images/popularize/38/6.jpg" alt="11"/>
</DIV>

</BODY>
</HTML>